import Vue from 'vue'
import Vuex from 'vuex'
import axios from 'axios'
Vue.use(Vuex)
//导入模块
import moduleA from "./modules/moduleA.js"
import moduleB from "./modules/moduleB.js"
export default new Vuex.Store({
	state: {
		//初始化数据
		list: [],
		//input 用户输入的内容
		val: "",
		//下一个id
		nextId: 5,
		//存一下此时点击的是那个按钮的标识
		flage: 'all'

	},
	mutations: {

		init(state, data) {
			state.list = data
		},

		//同步val的值
		changVal(state, value) {
			state.val = value;
		},
		//添加一项数据
		addItem(state) {
			const obj = {
				"id": state.nextId,
				"info": state.val,
				"done": false
			}
			if (obj.info == '') {
				alert('请输入要做的事')
			} else {
				state.list.push(obj);

				state.val = "";
				state.nextId++;
			}

		},
		//同步checkbox的值
		changeCheckbox(state, obj) {
			//找到点击这一项在list中的位置，然后修改checkbox值
			const index = state.list.findIndex(el => el.id == obj.ids);
			state.list[index].done = obj.checked;
		},

		removeItem(state, id) {
			const index = state.list.findIndex(el => el.id == id);
			state.list.splice(index, 1)
		},
		changeFlage(state, val) {
			state.flage = val


		},
		//清除已完成
		clearDone(state) {
			state.list = state.list.filter(el => !el.done);
		},
	},
	actions: {
		asyncInit(contxt) {
			//相对路径和绝对路径?
			axios.get('./list.json').then(res => {
				contxt.commit('init', res.data)
			})
		}

	},
	getters: {
		//统计未完成
		uncomplate(state) {
			return state.list.filter(el => !el.done).length;
		},

		filterList(state) {
			if (state.flage == "all") {
				return state.list;
			} else if (state.flage == "undone") {
				return state.list.filter(el => !el.done);
			} else if (state.flage == "done") {
				return state.list.filter(el => el.done);
			}
		}

	},
	modules: {
		//moduleA:moduleA
		moduleA,
		moduleB
	}


})
